    <!-- Advance table -->
    <script src="<?php echo $url_styles?>js/plugins/tables/jquery.dataTables.min.js"></script>
    <script src="<?php echo $url_styles?>js/plugins/tables/colResizable-1.3.min.js"></script>
    <script src="<?php echo $url_styles?>js/plugins/tables/jquery.tablesorter.min.js"></script> 
    
    <script src="<?php echo $url_styles?>js/plugins/formselements/jquery.ibutton.min.js"></script>  
    <script src="<?php echo $url_styles?>js/plugins/formselements/ui.spinner.min.js"></script> 
    <script>
		var page=1;
		/* --->> 9 - OS Styling --------------*/
        function load_ibutton(){
            $(".os_chbox").iButton({
                change: function(e)
                {
					if(typeof(e.attr('data'))=='undefined') return;
                    $.ajax({
                       url: '<?php echo url_create('admin','member','set_state')?>',
                       dataType: 'json',
                       type: 'post',
                       data: { 
                           id: e.attr('data'),
                           active: e.attr('checked')=='checked'?1:0
                       },
                       success: function(o)
                       {
                           if(o.state=='success')
                           {
                               str = $('#row_'+e.attr('data')).attr('class');
                               if(e.attr('checked')=='checked') 
                                   str = 'gradeA '+str.split(' ')[1];
                               else
                                   str = 'gradeX '+str.split(' ')[1];

                               $('#row_'+o.id).attr('class',str);
                           }
                           else{
                               $.jGrowl(o.message, {
                                   header: o.title,
                                   theme:"notification_styled_"+o.state 
                               });
                           }
                       }
                    });
					return false;
                }
            });
        }
        function load_table()
        {
            $.ajax({
               url: '<?php echo url_create('admin','member','read')?>',
               dataType: 'json',
               type: 'post',
			   data: {p: page},
               success: function(o)
               {
                   if(o.state=='success'){
                       var str='';
                       for(var i in o.data){
                           var r=o.data[i];
						   var row_class = (o.data[i].active==0)?'X':'A';
						   if(i%2==1) row_class+=" odd";
						   else row_class+=" even";
						   var checked_active = (o.data[i].active==1)?'checked':'';
                           str+='<tr id="row_'+r.id+'" class="grade'+row_class+'">'+
                                  '<td>'+r.username+'</td>'+
                                  '<td>'+r.email+'</td>'+
                                  '<td>'+r.fullname+'</td>'+
								  '<td>'+r.group+'</td>'+
								  '<td><input data="'+r.id+'" class="os_chbox" type="checkbox" '+checked_active+'/></td>'+
                                  '<td class="center"><a href="#modal" data="'+r.id+'" class="btn btn-mini btn-success row_edit"><?php echo lang('edit')?></a>&nbsp;<button class="btn btn-mini btn-danger row_delete" data="'+r.id+'"><?php echo lang('delete')?></button></td>'+
                              '</tr>';
                       }
                       $('#table tbody').html(str);
					   var p = o.pagination;
					   var pnumbers = p.left?'...':'';
                       for(var i in p.pnumbers){
						   var clas = p.pnumbers[i]==p.curr?'active':'button';
						   pnumbers+='<a data="'+p.pnumbers[i]+'" class="paginate_'+clas+'">'+p.pnumbers[i]+'</a>';
					   }
					   if(p.right) pnumbers+='...';
					   $('#table_paginate span').html(pnumbers);
					   $('#table_previous').attr('data',p.prev);
					   $('#table_next').attr('data',p.next);
					   $('#table_first').attr('data',p.first);
					   $('#table_last').attr('data',p.last);
					   load_ibutton();
                   }
               }
            });
        }
		$('#table_paginate a').live('click',function(e){
			var p = $(this).attr('data');
			if(p!=null){
				page=p;
				load_table();
			}
		});
        $('.row_delete').live('click',function(e){
            if(confirm('<?php echo lang('delete_confirm')?>'))
            {
                $.ajax({
                   url: '<?php echo url_create('admin','member','delete')?>',
                   type: 'post' ,
                   dataType: 'json',
                   data:{id: $(this).attr('data')},
                   success:function(o)
                   {
                       if(o.state == 'success')
                           $('#row_'+o.id).fadeOut(500);
                       else
                           $.jGrowl(o.message, {
                               header: o.title,
                               theme: "notification_styled_"+o.state 
                           });
                   }
                });
             }
        });
        
        $('.row_edit').live('click',function(e){
			$('#modal').attr('flag','edit');
			$('#modal').attr('data_id',$(this).attr('data'));
            $.ajax({
                url: '<?php echo url_create('admin','member','detail')?>',
                dataType: 'json',
                data: {id: $(this).attr('data')},
                success: function(o){
                    if(o.state=='success'){
                        
						// Ghi du lieu
						$('#username').attr('value',o.data.username);
						$('#email').attr('value',o.data.email);
						$('#fullname').val(o.data.fullname);
						$('#group_id').val(o.data.group_id);
						$('#active').val(o.data.active);
						
						// Gan lai tieu de 
						$('#modal_title').html('<?php echo lang('user_update')?>');
                        $('#modal_toggle').click();
						
                        
                    }
                    else
                        $.jGrowl(o.message, {
                            header: o.title,
                            theme:"notification_styled_"+o.state
                        });
                }
            })
        });
        
		$('.data_create').live('click',function(e){
			$('#modal').attr('flag','create');		
			// Reset field
			$('#username').attr('value','');
			$('#email').attr('value','');
			$('#password').attr('value','');
			$('#confirm').attr('value','');
			$('#fullname').attr('value','');
			$('#group_id').val('');
			$('#active').attr('value','');
			// Gan tieu de modal
			$('#modal_title').html('<?php echo lang('user_create')?>');
			$('#modal_toggle').click();
		});
		$('#modal_ok').live('click',function(e){
			$('.modal-form').submit();
		});
        $('.modal-form').submit(function(e){
			var flag = $('#modal').attr('flag');

			$.ajax({
				url: flag=='create'?'<?php echo url_create('admin','member','create')?>':'<?php echo url_create('admin','member','update')?>',
				dataType: 'json',
				type: 'post',
				data: {
					id: $('#modal').attr('data_id'),
					username: $('#username').val(),
					email: $('#email').val(),
					password: $('#password').val(),
					confirm: $('#confirm').val(),
					fullname: $('#fullname').val(),
					group_id: $('#group_id').val(),
					active: $('#active').val()
					
				},
				success: function(o){
					if(o.state=='success'){
						load_table();
						$('#modal_toggle').click();
						$.jGrowl(o.message, {
							header: o.title,
							theme:"notification_styled_"+o.state 
						});
					}else{
						alert(o.message);
					}
					
				}
			});
            return false;
        });
		
        $('#modal_cancel').live('click',function(e){
            $('#modal_toggle').click();
        });
        $(document).ready(function(){
			load_table();
			$.ajax({
				url: '<?php echo url_create('admin','group','get_all')?>',
				dataType: 'json',
				success: function(o){
					var str = '';
					for(var i in o.data){
						str+='<option value="'+o.data[i].id+'">'+o.data[i].name+'</option>';
					}
					$('#group_id').html(str);
				}
				
			})
		});
    </script>
    